<template>
  <div>
    <my-form-drawer :title="title" :width="450" :visible="visible" @ok="edit" @cancel="onClose" :footer="!disabled">
      <a-form-model ref="form" :model="form" :rules="rules">
        <a-form-model-item label="应用名称" prop="appName">
          <a-input v-model="form.appName" :maxLength="50"  :disabled="disabled"/>
        </a-form-model-item>
        <a-form-model-item label="应用key" prop="appKey">
          <a-input v-model="form.appKey" :maxLength="50"  :disabled="disabled"/>
        </a-form-model-item>
        <a-form-model-item label="应用秘钥" prop="appSecret">
          <a-input v-model="form.appSecret" :maxLength="50"  :disabled="disabled"/>
        </a-form-model-item>
        <a-form-model-item label="应用状态" prop="appStatus">
          <a-select style="select" v-model="form.appStatus"  :disabled="disabled">
            <a-select-option :value="1">启用</a-select-option>
            <a-select-option :value="0">禁用</a-select-option>
          </a-select>
        </a-form-model-item>
      </a-form-model>
    </my-form-drawer>
  </div>
</template>

<script>
import moment from 'moment';
import { add, update } from '@/services/applicationInfo';
import { detail } from "@/services/applicationInfo";
import MyFormDrawer from '@/components/drawer/MyFormDrawer';
function copy(obj1, obj2) {
  if (obj1 != null && obj2 != null) {
    for (let p in obj1) {
      obj1[p] = obj2[p];
    }
  }
}

export default {
  name: 'ApplicationInfoEdit',
  components: { MyFormDrawer },
  data() {
    return {
      type: 0,
      title: '',
      form: {
        appName: '',
        appKey: '',
        appSecret: '',
        appStatus: '1',
        id: 1,
      },
      rules: {
        appName: [{ required: true, message: '应用名称不能为空', trigger: 'change' }],
        appKey: [{ required: true, message: '应用key不能为空', trigger: 'change' }],
        appSecret: [{ required: true, message: '应用密钥不能为空', trigger: 'change' }],
        appStatus: [{ required: true, message: '应用状态不能为空', trigger: 'change' }],
      },
      visible: false,
      disabled: false
    };
  },
  computed: {},
  created() {
    this.initData();
  },
  methods: {
    moment,
    initData() {
      copy(this.form, {});
    },

    changeForm(state, action, data) {
      this.visible = state;
      this.type = action;
      this.title = this.type ? this.type == 2 ? '查询应用' : '编辑应用' : '新增应用';
      this.disabled = this.type == 2
      copy(this.form, data);
      if (this.type == 0) {
        if (this.form.appStatus == null)
          this.form.appStatus = 1;
      }
      if (this.type) {
        detail({ id: data.id }).then((res) => {
          let result = res.data;
          if(result.code == 0) {
            copy(this.form, result.data);
          } else {
            this.$message.error(result.message)
          }
        })
      }
    },
    onClose() {
      this.visible = false;
      this.$refs['form'].clearValidate();
      this.initData();
    },
    edit() {
      this.$refs.form.validate((valid) => {
        if (!valid) {
          return false;
        }
        if (this.type) {
          update(this.form).then((res) => {
            console.log(res);
            if (res.data.code === 0) {
              this.$message.success('修改成功');
              this.onClose();
              this.$emit('getList');
            } else {
              this.$message.error('修改失败')
            }
          });
        } else {
          add(this.form).then((res) => {
            console.log(res);
            if (res.data.code === 0) {
              this.$message.success('添加成功');
              this.onClose();
              this.$emit('getList');
            } else {
              this.$message.error('修改失败')
            }
          });
        }
      });
    },
  },
};
</script>

<style lang="less" scoped>

</style>
